<template>
  <yd-layout>
    <yd-navbar slot="navbar" title="预约" />
    <store-select v-if="!sid" />
    <div v-else style="background:#fff;">
      <div style="border-bottom:1px solid #eee;">
        
        <div>
          {{sname}}
        </div>
      </div>
      <yd-flexbox v-if="sid">
          <yd-flexbox-item style="border-right:1px solid #eee;">
            <item-select />
          </yd-flexbox-item>
          <yd-flexbox-item>
            <item-select />
          </yd-flexbox-item>
      </yd-flexbox>
      
    </div>
    <layout-home-tabbar selected="reservation" slot="tabbar" @change:tab="handleTabChange" />

    
  </yd-layout>
</template>

<script>
import pageMixin from "../../../mixins/page";
import layoutHomeTabbar from "../layout/home-tabbar";
import itemSelect from "./components/items-select";
import storeSelect from "./components/store-select";
export default {
  mixins: [pageMixin],
  components: { layoutHomeTabbar, storeSelect, itemSelect },
  data() {
    return {};
  },
  computed: {
    sid() {
      return this.$store.state.reservation.formData.sid;
    },
  },
  methods: {
    handleTabChange(val) {
      // 此处 home tab 的name 与 route 的name 相同
      this.$router.push({
        name: val,
      });
    },
  },
};
</script>

<style>

</style>
